<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>伟哥版五子棋游戏</title>
    <meta name="description" content="伟哥版五子棋游戏"/>
    <link rel="stylesheet" type="text/css" href="css/layout.css"/>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js" type="text/javascript"></script>
</head>
<body style="text-align: center">
<div class="wrapper">
    <div class="chessboard"></div>
    <div class="operating-panel">
        <p>
            <a id="black_btn" class="btn selected" href="#">黑&nbsp;&nbsp;子</a>
            <a id="white_btn" class="btn" href="#">白&nbsp;&nbsp;子</a>
        </p>
        <p>
            <a id="first_move_btn" class="btn selected" href="#">先&nbsp;&nbsp;手</a>
            <a id="second_move_btn" class="btn" href="#">后&nbsp;&nbsp;手</a>
        </p>
        <a id="replay_btn" class="btn" href="#">开&nbsp;&nbsp;&nbsp;始</a>
        <p id="result_info">胜率：100%</p>
        <p id="result_tips"></p>
    </div>

    <div style="display: none">
        <!-- 图片需合并 减少http请求数 -->
        <img src="images/black.png" alt="preload"/>
        <img src="images/white.png" alt="preload"/>
        <img src="images/hover.png" alt="preload"/>
        <img src="images/hover_up.png" alt="preload"/>
        <img src="images/hover_down.png" alt="preload"/>
        <img src="images/hover_up_left.png" alt="preload"/>
        <img src="images/hover_up_right.png" alt="preload"/>
        <img src="images/hover_left.png" alt="preload"/>
        <img src="images/hover_right.png" alt="preload"/>
        <img src="images/hover_down_left.png" alt="preload"/>
        <img src="images/hover_down_right.png" alt="preload"/>
        <img src="images/black_last.png" alt="preload"/>
        <img src="images/white_last.png" alt="preload"/>
    </div>
</div>
</body>
<script type="text/javascript" src="js/CookieHandle.js"></script>
<script type="text/javascript" src="js/rule.js"></script>
<script type="text/javascript" src="js/board.js"></script>
</html>